require(['./config'],() =>{
    require(['template','header','footer','bootstrap'],(template) =>{
        class MyOreder {
            constructor () {
                this.lastindex = 0
                this.index = 0
                this.bindEvent()
                this.rendonMyOrder(0,3)
                this.paging()
            }
            bindEvent () {
                const _this = this
                $('.order-all .nav ul').on('click','li',function () {
                    if($(this).hasClass('order')){
                        _this.rendonMyOrder()
                    }else{
                        $('.no-order').show()
                        $('.have-order').addClass('appear')
                    }
                    var index = $(this).index()
                        _this.lastindex = _this.index
                        _this.index = index
                        _this.change()
                    
                })
            }
            change () {
                $('.order-all .nav ul li').eq(this.lastindex).removeClass('ac')
                $('.order-all .nav ul li').eq(this.index).addClass('ac')
                $('.no-order .no-order-one').eq(this.lastindex).addClass('appear')
                $('.no-order .no-order-one').eq(this.index).removeClass('appear')
            }
            rendonMyOrder (startpag,endpag) {
                var myorder = localStorage.getItem('myorder')
                if(myorder){
                    myorder = JSON.parse(myorder)
                    var orderNum = Math.ceil(myorder.length/3)
                    $('.no-order').hide()
                    $('.have-order').removeClass('appear')
                    if(orderNum > 1){
                        myorder = myorder.slice(startpag,endpag)
                    }
                    $('#good-list').html(template('myOrdertemplate',{myorder}))
                }
            }
            paging () {
                var _this = this
                $('.paging').on('click','li',function () {
                    if($(this).hasClass('pag-one')){
                        var startpag = 0,
                            endpag = 3
                    }else if($(this).hasClass('pag-two')){
                        var startpag = 3,
                            endpag = 6
                    }else if($(this).hasClass('pag-three')){
                        var startpag = 6,
                            endpag = 9
                    }
                    _this.rendonMyOrder(startpag,endpag)
                })
            }
        }
        new MyOreder()
    })
})